﻿@using Blazor.Diagrams.Components.Renderers


@if (Node.Form.CorrelationId == Constants.EmptyStep.CorrelationId)
{
    <div class="final-step">
        @if(Node.IsBlocked)
        {
            <svg width="40" height="40">
                <circle cx="20" cy="20" r="18" stroke="black" stroke-width="3" fill="black" />
                <text class="lck" x="20" y="20" font-family="FontAwesome" fill="white" text-anchor="middle" alignment-baseline="middle">lock</text>
            </svg>
        }
        else
        {
            <div class="toolbox">
                <RadzenButton Icon="edit" Click="HandleEdit" ButtonStyle="ButtonStyle.Primary" Size="ButtonSize.ExtraSmall" Disabled="@Node.IsBlocked" />
            </div>
            <svg width="40" height="40">
                <circle cx="20" cy="20" r="18" stroke="black" stroke-width="3" fill="black" />
            </svg>
        }

        @foreach (var port in Node.Ports)
        {
            <PortRenderer @key="port" Port="port"></PortRenderer>
        }
    </div>
}
else
{
    <div class=@StepClassName>
        @if(Node.IsBlocked)
        {
            <div class="blocked-overlay">
                <RadzenIcon Icon="lock"></RadzenIcon>
            </div>
        }
        else
        {
            <div class="toolbox">
                <RadzenButton Click="HandleEdit" Icon="edit" ButtonStyle="ButtonStyle.Primary" Size="ButtonSize.ExtraSmall" Disabled="@Node.IsBlocked" />
            </div>
        }


        <RadzenText TextStyle="TextStyle.Subtitle2">The step is <b>@Node.Form.Name</b></RadzenText>
        @foreach (var port in Node.Ports)
        {
            <PortRenderer @key="port" Port="port"></PortRenderer>
        }
    </div>
}
@code {
    [Parameter] public WorkflowStepNode Node { get; set; }

    private void HandleEdit()
    {
        if (Node.EditCb != null || Node.IsBlocked) Node.EditCb(Node);
    }

    public string StepClassName
    {
        get
        {
            return $"step-selected" + (Node.IsBlocked ? " blocked" : string.Empty);
        }
    }
}
